<!DOCTYPE html>
<html lang="zh-cmn-Hans">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
  <!-- Set render engine for 360 browser -->
  <meta name="renderer" content="webkit" />
  <!-- No Baidu Siteapp-->
  <meta http-equiv="Cache-Control" content="no-siteapp" />
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon" />
  <link rel="icon" type="image/png" href="/img/app-icon72x72.png" />
  <!-- Add to homescreen for Chrome on Android -->
  <meta name="mobile-web-app-capable" content="yes" />
  <link rel="icon" sizes="192x192" href="/img/app-icon72x72@2x.png" />
  <!-- Add to homescreen for Safari on iOS -->
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  <meta name="apple-mobile-web-app-title" content="标题" />
  <link rel="apple-touch-icon-precomposed" href="/img/app-icon72x72@2x.png" />
  <!-- Tile icon for Win8 (144x144 + tile color) -->
  <meta name="msapplication-TileImage" content="/img/app-icon72x72@2x.png" />
  <meta name="msapplication-TileColor" content="#0e90d2" />
  <meta name="viewport" content="width=1200, user-scalable=yes">
  <title>区县风采</title>
  <meta name="description" content="" />
  <meta name="keywords" content="" />
  <!-- /meta -->
  <script src="https://wenhuabu-media.bj.bcebos.com/front-end-engineer/Intangible-heritage/static/js/xianwenhauyun/pace.min.js"></script>
  <link href="https://wenhuabu-media.bj.bcebos.com/front-end-engineer/Intangible-heritage/static/js/xianwenhauyun/pace-theme-minimal.min.css" rel="stylesheet">
  <!--[if lte IE 9]>
  <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
  <!--[if gt IE 9]><!-->
  <script src="https://wenhuabu-media.bj.bcebos.com/front-end-engineer/Intangible-heritage/static/js/xianwenhauyun/jquery.3.3.1min.js"></script>
  <!--<![endif]-->
  <!-- /script -->

  <link rel="stylesheet" href="/css/main.min.css">

  <!-- /style -->
</head>

<body>

  <div class="page county-view">


    <section class="common_header_item">

      <header class="page__header">
        <div class="section__wrapper" style="width: 1220px;">
          <div class="column-inner clearfix">
            <div class="header-search">
              <!-- logo -->
              <h1 class="header-logo"><a href="/"><img src="img/poster/logo.png"  title="国家公共文化云" alt="国家公共文化云" /></a></h1>
              <!-- info user -->
              <div class="topbar-sign">
                <!-- <a class="iconfont user" href="/user-center-order.html">&#xe65f; </a>
                    <i class="separator">|</i>
                    <a href="#">1599999999</a>
                    <a href="#">退出</a> -->
                <a href="/signin.html">登录</a>
                <i class="separator">|</i>
                <a href="/signup.html">注册</a>
              </div>
              <!-- search -->
              <form class="form-header-search search-hover-active">
                <input type="text" placeholder="请输入关键字搜索" name="" id="">
                <a href="search-result.html">
                  <div class="search-button"><i class="iconfont icon-search" title="搜索">&#xe603;</i>
                  </div>
                </a>
              </form>

            </div>
          </div>
        </div>
      </header>

      <article class="section page__main_nav">
        <div class="section__wrapper" style="width: 1220px;">
          <div class="column-inner clearfix">
            <nav class="page__nav bar__inner j_follow_bar_nav">
              <li class="nav__item" data-nav="index"><span class="nav__title"><a href="index.html">首页</a></span>
              </li>
              <li class="nav__item" data-nav="news"><span class="nav__title"><a href="news.html">新闻资讯</a></span>
              </li>
              <li class="nav__item" data-nav="live"><span class="nav__title"><a href="live.html">资源点播</a></span>
              </li>
              <!-- <li class="nav__item" data-nav="ancient"><span class="nav__title"><a href="ancient-culture.html ">文化活动</a></span></li> -->
              <li class="nav__item" data-nav="activity"><span class="nav__title"><a href="activity.html">文化活动</a></span>
              </li>
              <li class="nav__item" data-nav="venue"><span class="nav__title"><a href="venue.html">场馆导航</a></span>
              </li>
              <li class="nav__item" data-nav="network"><span class="nav__title"><a href="network-train.html">网络培训</a></span>
              </li>
              <!-- <li class="nav__item" data-nav="travel"><span class="nav__title"><a href="culture-travel.html">文化旅游</a></span></li> -->
              <!-- <li class="nav__item" data-nav="heritage"><span class="nav__title"><a href="culture-heritage.html ">文化非遗</a></span></li> -->
              <!-- <li class="nav__item" data-nav="volunteer"><span class="nav__title"><a href="volunteer-event-archive.html">志愿服务</a></span></li> -->
              <!-- <li class="nav__item" data-nav="app"><span class="nav__title"><a href="#">社团管理</a></span></li> -->
              <li class="nav__item" data-nav="exhibition"><span class="nav__title"><a href="exhibition-list.html">网上展厅</a></span>
              </li>
              <span class="follow__bar"></span>
            </nav>
          </div>
        </div>
      </article>
    </section>
    <!-- /header -->
    <main class="page__container">
      <section class="section section__breadcrumb">
        <div class="section__wrapper">
          <div class="pure-u-1">
            <div class="column-inner">
              <div class="nav__breadcrumb">
                <a class="item" href="index.html">首页</a>
                <span class="separator">&gt;</span>
                <a class="item active" href="javascript:void(0)">区县风采</a> 
              </div>
            </div>
          </div>
        </div>
      </section>
      <!-- / breadcrumb -->
      <!-- 分类 -->
      <section class="section">
        <div class="section__wrapper">
          <div class="section__container">
            <div class="module-filter-wrapper">

              <div class="module module-filter">
                <h3 class="title"><i class="iconfont icon-activity-fill"></i>智能排序 :</h3>
                <div class="module-filter-list">
                  <a class="item active" data-filter="activity-channel-1" href="#">全部</a>
                  <a class="item" data-filter="activity-channel-2" href="#">最新发布</a>
                  <a class="item" data-filter="activity-channel-3" href="#">人气最高</a> 
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
      <!-- 列表内容 -->
      <section class="section">
        <div class="section__wrapper">
          <div class="section__container">
            <div class="module media-list">
              <div class="pure-u-1-4">
                <div class="column-inner card">
                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card ">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_1.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>未央区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_1.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>未央区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_2.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>新城区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_2.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>新城区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_3.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>碑林区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_3.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>碑林区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_4.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>莲湖区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_4.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>莲湖区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_5.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>灞桥区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_5.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>灞桥区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_6.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>雁塔区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_6.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>雁塔区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_7.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>阎良区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_7.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>阎良区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_8.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>临潼区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_8.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>临潼区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_9.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>长安区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_9.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>长安区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_10.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>高陵区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_10.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>高陵区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_11.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>鄠邑区</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_11.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>鄠邑区</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_12.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>蓝田县</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_12.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>蓝田县</h2>
                      </div>
                    </a>
                  </div>

                  <div class="media media__type_01 media__bdtype_01 media-bg-white media-normal media-card card">
                    <a class="object font" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_13.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>周至县</h2>
                      </div>

                    </a>
                    <a class="object back" href="#">
                      <img class="img-res" src="../img/img_xian-PC/county_13.png" alt="">
                      <div class="cover-text">
                        <i class="iconfont">&#xe7a0;</i>
                        <hr>
                        <h2>周至县</h2>
                      </div>
                    </a>
                  </div>

                </div>
              </div>








            </div>
          </div>
        </div>
      </section>
      <nav class="page-pagination" aria-label="page-pagination">
        <ul class="pagination">
          <li class="item previous"><a href="#" aria-label="Previous" aria-hidden="true">首页</a>
          </li>
          <li class="item active"><a href="#">1</a>
          </li>
          <li class="item"><span>2</span>
          </li>
          <li class="item"><a href="#">3</a>
          </li>
          <li class="item"><a href="#">4</a>
          </li>
          <li class="item"><a href="#">5</a>
          </li>
          <li class="item"><a href="#">6</a>
          </li>
          <li class="item next"><a href="#" aria-label="Next" aria-hidden="true">下一页</a>
          </li>
          <li class="item">跳转到</li>
          <li class="item">
            <input type="text" />
          </li>
          <li class="item">页</li>
          <li class="item active"><a href="#">&nbsp;&nbsp;GO&nbsp;&nbsp;</a>
          </li>
          <li class="item news-number">当前共有<i>1000</i>条</li>
        </ul>
      </nav>
      <!-- / pagination -->
    </main>
    <!-- / container -->

    <footer class="page__footer">
      <section class="footer-main">
        <div class="section__wrapper footer-top">
          <div class="footer-r">
            <img src="../img/footer-logo/fool-logo.png" alt="">
            <div class="region">
              <span>热线：192832083</span>
              <span>地址：黑龙江省哈尔滨市通河县松花江大街23号正西方向90米</span>
            </div>
            <div class="relation">
              <span>邮箱：192832083s33f</span>
              <span>传真：192832083s33f</span>
            </div>
          </div>
          <div class="footer-middle">
            <div class="middle-title">友情链接</div>
            <div class="middle-href">
              <a href="#">国家公共文化云</a>
              <a href="#">中国数字文化网</a>
              <a href="#">哈尔滨市文化和旅游厅</a>
            </div>
            <div class="middle-href">
              <a href="#">国家公共文化云</a>
              <a href="#">中国数字文化网</a>
              <a href="#">哈尔滨市文化和旅游厅</a>
            </div>
          </div>
          <div class="footer-qr">
            <img src="../img/footer-logo/qr.png" alt="">
            <div class="qr-title">官方微信</div>
          </div>
        </div>
      </section>
      <section class="footer-bot-main">
        <div class="section__wrapper footer-bot">
          版权所有Copyright © 2020通河县文化与旅游厅 黑ICP备XXXXXXXXXX号
        </div>
      </section>
    </footer>
    <!-- / footer -->

    <!-- / pendant -->
  </div>
  <!-- /page -->
  <script type="text/html" id="tplTeml">
  </script>


  <script src="https://culturetv.hanyastar.com.cn/national_culture_file/pcjs/underscore-min-1.8.3/underscore-min.js"></script>
  <script src="https://wenhuabu-media.bj.bcebos.com/front-end-engineer/Intangible-heritage/static/js/xianwenhauyun/bowser.min.js"></script>
  <script src="https://wenhuabu-media.bj.bcebos.com/front-end-engineer/Intangible-heritage/static/js/xianwenhauyun/swiper3.4.2.jquery.min.js"></script>
  <link href="https://wenhuabu-media.bj.bcebos.com/front-end-engineer/Intangible-heritage/static/js/xianwenhauyun/swiper3.4.2.min.css" rel="stylesheet">
  <script src="https://culturetv.hanyastar.com.cn/national_culture_file/pcjs/layer-3.0.3/layer.min.js"></script>



  <!-- 前端交互脚本 -->
  <script src="js/common/xtab.js"></script>
  <script src="js/common/xbar.js"></script>
  <script src="js/common/util.js"></script>

  <script src="js/app.js"></script>
  <script src="/js/common.min.js"></script>


  <script src="js/common/gb2260.js"></script>
  <script src="js/common/hs-area.js"></script>
  <!-- /script -->
  <script>
    $(document).ready(function() {
      // 过滤标签交互效果
      var myUtil = hs.util;
      myUtil.itemActive({
        parent: ".module-filter-list",
        item: '.item',
        active: 'active'
      });
      // 过滤标签没有加链接就阻止#跳转
      $('.module-filter-list').on('click', '.item', function(e) {
        var $this = $(this);
        if ($this.attr('href') === "#") {
          e.preventDefault();
        }
      });


      // 地址联动操作
      var myArea = new hs.area({
        activeProvinceCode: "450000",
        //activePrefectureCode: "450100"
        //or: activeCountyCode: "130303"
      });
      myArea.init();

      $('.j_select_area_submit').on('click', function() {
        $('[data-area-filter="all"]').removeClass('active');
      });

      $('[data-area-filter="all"]').on('click', function() {
        // do something
      });

      //模拟ajax
      function ListDate(obj, sql, num) {
        var tpl = "";
        for (var i = 0; i < num; i++) {
          tpl += $('#' + sql).html();
        }
        $('.' + obj).append(tpl);
      }
      ListDate('media-list', 'tplTeml', 16);

    });
  </script>
</body>

</html>